<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
</head>

<body>
    <button>点击我跳转到a历史记录</button>
    <button>点击跳转到下个历史记录</button>
    <button>点击我跳转到b历史记录</button>

    <script>
        /*  注意：通过js来操作浏览器的历史记录 ，前提是必须有历史记录； */
        var btn = document.getElementsByTagName("button");
        btn[0].onclick = function() {
            window.location.href = "./a.html";
        };

        /*  window:浏览器
              history：历史记录
              forwar：前进 */

        btn[1].onclick = function() {
            window.history.forward();
        };

        // 总结： 1.必须有历史记录 2.前进历史记录 forward  3.后退历史记录 back 。无论是前进还是回退都只操作一个页面
        // 4.window.history.go(数字);

        // 二、跳转到指定历史记录；
        // window.history.go(数字) ： 0是当前页面 正数是前进的历史记录  负数是回退的历史记录

        btn[2].onclick = function() {
            window.history.go(2);
        };
        btn[2].onclick = function() {
            window.location.href = "./b.html";
        };
    </script>
</body>

</html>